<script setup>
	import FirstTitle from "@comp/FirstTitle";
	import {
		Editor,
		Toolbar
	} from "@wangeditor/editor-for-vue";
	import {
		onMounted
	} from "vue";
	import {
		searchDataZzgz
	} from "@/api/search";
	import {
		addOrUpdateZzgz
	} from "@/api/addOrUpdate";


	const city = window.globalObj.name;
	const editorRef = shallowRef();
	const editorRef1 = shallowRef();

	const toolbarConfig1 = {};
	const toolbarConfig = {};
	const editorConfig = {
		placeholder: "请输入内容..."
	};
	const mode = ref("default");
	const mode1 = ref("default");

	// 加载html
	const initHtml = () => {
		searchDataZzgz({
			m: "原则要求"
		}).then((res) => {
			const {
				data
			} = res
			valueHtml.value = data.find((x) => x.k === "基本原则")?.v || "";
			valueHtml1.value = data.find((x) => x.k === "具体要求")?.v || "";
		})
	};

	const handleCreated = (editor) => {
		editorRef.value = editor; // 记录 editor 实例，重要！
	};
	const handleCreated1 = (editor) => {
		editorRef1.value = editor; // 记录 editor 实例，重要！
	};

	const valueHtml = ref(
		"一是听党指挥，积极行动。坚决贯彻落实党中央的决策部署，牢记人民利益高于一切，第一时间行动起来，把城市防空作战作为当前最重要的政治任务，带领广大党员干切实抓好落实，在防空斗争中众志成城，筑起一道牢不可破的防线。二是模范带头，冲锋在前。认真贯彻落实习近平总书记重要讲话、重要指示精神和党中央决策部署，发挥集中力量办大事的制度优势，筑牢城市防空作战的防线。发扬党员干部的模范带头作用，发扬不怕苦、不怕累精神，主动认领任务，积极冲锋在前，带领广大党员为城市防空作贡献。三是履行责任，勇于担当。坚持把人民群众生命安全放在第一位，带领群众在城市防空作战中上当先锋、作表率，践行全心全意为人民服务的宗旨，把人民利益放在心中最高位置，冲在一线，发扬连续作战的作风，为打赢城市人民防空作战贡献力量。"
	);

	const valueHtml1 = ref(
		"战时防空袭斗争政治工作由各级组织部门、宣传部门、党团部门负责，分区划片，责任到人；借助广播、电视、报纸、网络、手机短信等各种媒体进行宣传动员，利用各级基层党团组织、人防志愿者和各类群众团体，采用宣讲、悬挂标语和分发传单等方式进行防空袭斗争的政治动员和人防宣传教育工作。"
	)

	const saveProgramme = () => {
		ElMessageBox.confirm(`确定要保存吗?`, "警告", {
			confirmButtonText: "确定",
			cancelButtonText: "取消",
			type: "warning",
			customClass: "message-box",
		}).then(() => {
			addOrUpdateZzgz({
					m: "原则要求",
					data: [{
							k: "基本原则",
							v: valueHtml.value,
						},
						{
							k: "具体要求",
							v: valueHtml1.value,
						}
					],
				})
				.then((result) => {
					if (result.code === 200) {
						ElMessage.success("操作成功");
						initHtml();
					} else {
						ElMessage.error(result.msg);
					}
				})
				.catch(() => {});
		});
	}

	onMounted(() => {
		initHtml();
	});
	onBeforeUnmount(() => {
		const editor = editorRef.value;
		const editor1 = editorRef1.value;
		if (!editor) return;
		if (!editor1) return;
		editor.destroy();
		editor1.destroy();

	});
</script>
<template>
	<div class="">
		<div class="top-15">主要明确政治工作的原则和具体要求。</div>
		<FirstTitle name="基本原则" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef" :defaultConfig="toolbarConfig"
				:mode="mode" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml" :defaultConfig="editorConfig"
				:mode="mode" @onCreated="handleCreated" />
		</div>

		<FirstTitle name="具体要求" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef1" :defaultConfig="toolbarConfig1"
				:mode="mode1" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml1" :defaultConfig="editorConfig"
				:mode="mode1" @onCreated="handleCreated1" />
		</div>

		<div class="flex-justify-end top-20">
			<el-button type="primary" class="save-btn" @click="saveProgramme">保存</el-button>
		</div>
	</div>
</template>
<style scoped lang="scss"></style>